<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页面</title>
    <style>
        /* 添加样式 */
        .container {
            display: flex;
            flex-direction: column;
            justify-content: center;
            min-height: 100vh;
            background-color: #f0f0f0;
        }

        /* 新增样式类 */
        .form-group {
            display: flex;
            justify-content: center;
        }

        /* 登录按钮缩小样式 */
        .small-button {
            width: 10%;
            padding: 5px 10px; /* 调整内边距以减小按钮大小 */
            font-size: 16px; /* 减小字体大小 */
        }

        /* 可选：为注册链接添加样式以居中 */
        .register-link {
            text-align: center;
        }
        .h1 {
            text-align: center;
            background-color: #f9f6f6;
        }
    </style>
    <link rel="stylesheet" href="css/style.css">
</head>
<body>
    <h1 class="h1">欢迎来到学生管理系统</h1>
    <div class="container">
        <form action="/login" method="post">
            <!-- 为包含输入框的div应用新的样式类 -->
            <div class="form-group">
                <input type="text" name="username" placeholder="用户名">
            </div>
            <div class="form-group">
                <input type="text" name="password" placeholder="密码">
            </div>
            <div class="form-group"> <!-- 将按钮也放入一个div并应用样式 -->
                <button type="submit" class="small-button">登录</button>
            </div>
        </form>        
        <!-- 为注册链接应用新的样式类 -->
        <h4 class="register-link"><a href="/register_page">新用户注册</a></h4>
    </div>
</body>
</html>